<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>No Login Data</title>

		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>login successfully</title>
		<link rel="stylesheet" href="../css/style.default.css" type="text/css" />
		<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
		<script src="../js/baseServerLink.js" type="text/javascript" charset="utf-8"></script>

		<style>
		.redAlert{
			color:red;
			animation: twinkle 1s infinite alternate;
		}
		@keyframes twinkle {
			0%{
				opacity:0.8;
			}
			100%{
				opacity:0.2;
			}
		}
		
		.greenAlert{
			color:green;
		}
		</style>
		
		<script type="text/javascript">
			function userDetail(file) {
				var o = document.getElementById("detail");
				var tops = file.offsetTop - 80;
				o.offsetTop = tops;
				var str = tops + "px;"
				o.style.visibility = "visible";
			}
		
			function closed() {
				var o = document.getElementById("detail");
				o.style.visibility = "hidden";
			}
			
			
			
			$(function(){
				//检查函数
				fcheck = function (){
					$("#save").attr("disabled", false);
					//密码
					var $newPwd = $("#newPwd");
					//确认密码
					var $confirmNewPwd = $("#confirmNewPwd");
					if($newPwd.val() == ""){
						$("#save").attr("disabled", true);
						$("#newPwdSide").text("密码不能为空！");
						$("#confirmSide").val(" ");
						$("#newPwdSide").attr("class", "desc redAlert");
					}
					else{
						$("#newPwdSide").text("Accepted");
						$("#newPwdSide").attr("class", "desc greenAlert");
					}
					
					if($newPwd.val() != $confirmNewPwd.val()){
						$("#save").attr("disabled", true);
						$("#confirmSide").text("确认密码不一致！");
						$("#confirmSide").attr("class", "desc redAlert");
					}else{
						$("#confirmSide").text("Accepted");
						$("#confirmSide").attr("class", "desc greenAlert");
					}
					
					
				}
				
				
				
				// $oldPwd=$("#oldPwd");
				$newPwd=$("#newPwd");
				$confirmNewPwd=$("#confirmNewPwd");
				
				//设置禁用
				$("#save").attr("disabled", true);
				
				
				
				// $oldPwd.change(fcheck);
				$newPwd.keyup(fcheck);
				$confirmNewPwd.keyup(fcheck);
				fcheck();
				// //按下重置按钮，不能提交
				// $("#reset").click(function(){
				// 	$("#save").attr("disabled", true);
				// })
			});
		</script>
		

		<style type="text/css">
			.my_green_button {
				background-color: #95f04b;
				border: 0;
				border-radius: 20px;
				-moz-border-radius: 20px;
				/* 老的 Firefox */
				font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
				font-weight: bold;
				color: #5c8f30;
				border: 1px solid #6eac3a;
				
			}
			.my_green_button:hover{
				color: #7ecb3f;
			}
		</style>
		
		<script>
			// 提交ajax
			$(function(){
				
				$("#save").click(function(){
					console.log('submit:ciuserregister');
					
					if($("#sid").val() == ""){
						alert("账户学（工）号禁止为空！");
						return;
					}
					
					if(confirm("您将要注册的账户学（工）号是: \n    " + $("#sid").val() + "\n一旦注册，此值将不能更改！是否继续？") == false){
						return;
					}
					
					if(prompt("请再次输入您将要注册的账户学（工）号以确认：") != $("#sid").val()){
						alert("您输入的账户学（工）号与页面内填写的不一致！请再次确认后重新提交。");
						return;
					}
					
					$.ajax({
						url:"../CiuserServlet",
						type:"POST",
						data:{
							'mode':'12',
							'activation_code':$("#activation_code").val(),
							'sid':$("#sid").val(),
							'name':$("#name").val(),
							'password':$("#newPwd").val(),
							'email':$("#email").val()
						},
						success:function(message){
							
							alert('已成功注册此账户');
							window.location.href = "../index.jsp";
							//--'regSuccess.jsp?sid='+$("#sid").val()+'&name='+$("#name").val();

						},
						 error: function (xhr, textStatus, errorThrown) {
								/*错误信息处理*/
				// 　　　　　　　　alert("进入error---");
				// 　　　　　　　　alert("状态码："+xhr.status);
				// 　　　　　　　　alert("状态:"+xhr.readyState)；//当前状态,0-未初始化，1-正在载入，2-已经载入，3-数据进行交互，4-完成。
				// 　　　　　　　　alert("错误信息:"+xhr.statusText );
				// 　　　　　　　　alert("返回响应信息："+xhr.responseText );//这里是详细的信息
				// 　　　　　　　　alert("请求状态："+textStatus); 　　　　　　　　
				// 　　　　　　　　alert(errorThrown); 　　　　　　　　
				// 　　　　　　　　alert("请求失败"); 
							alert("错误"+xhr.status+"\n如果此情况持续出现，请将此页面的内容反馈给管理员。\n"+ xhr.statusText + "\n" +xhr.responseText );
					     } 
						
					});
				});
				
				//检查学号在数据库中是否重复
				$("#sid").keyup(function(){
					console.log('检查学号字段')
					console.log($("#sid").val())
					if($("#sid").val() == ''){
						$("#sidside").text('此字段不能为空！');
						$("#sidside").attr('class', 'redAlert');
					}
					else{
						$("#sidside").text('Accepted');
						$("#sidside").attr('class', 'greenAlert');
						$.ajax({
							url:"../CiuserServlet",
							type:"POST",
							data:{
								'mode':'42',
								'sid':$("#sid").val()
							},
							
							success:function(message){
								//alert(message);
								
								//将json字符串转换为JavaScript的内置对象，
								eval('message='+message);
								
								
								
								if(message['state'] == 'existed'){
									$("#sidside").text('此用户已存在');
									$("#sidside").attr('class', 'redAlert');
									$("#save").attr("disabled", true);//禁用
								}else{
									$("#sidside").text('Accepted');
									$("#sidside").attr('class', 'greenAlert');
									$("#save").attr("disabled", false);//启用
								}
							},
							
							error:function(message){
								alert("错误：\n"+message);
							}
						});
					}//else
					
				})
			});
		</script>

	</head>

	<body>
		<div class="bodywrapper">
			<div class="topheader orangeborderbottom5">
				<div class="left">
					<h1 class="logo">脸<span>云</span></h1>



					<br clear="all" />

				</div>
				<!--left-->

				<div class="right">

					<!--userdata-->
				</div>
				<!--userinfodrop-->
			</div>
			<!--right-->
		</div>
		<!--topheader-->

		<div class="" style=" ">
			<div class="contentwrapper padding10" style="margin:0 auto; width: 80%; text-align: center;">
				<div class="errorwrapper error403" style=" ">
					<div class="errorcontent">
						<h1>账户注册</h1>
						<h3>check-in register</h3>
						<style type="text/css">
							td:nth-child(1) {
								text-align: right;
								width: 40%;
								/*background-color: red;
							*/}

							td:nth-child(2) {
								text-align: left;
								width: 60%;
								/*background-color: green;
							*/}
						</style>
						<form class="stdform" action="" method="post">
							<br />
							<table border="0" cellspacing="" cellpadding="" width="80%" style="">
								<tr>
									<td><span>激活码 </span></td>
									<td>
										<input type="text" id="activation_code" class="longinput"/>
										<br><span id="accode" class="desc">将自动忽略连字符'-'</span>
									</td>
								</tr>
								<tr>
									<td><span>学号：</span></td>
									<td>
										<input type="text" id="sid" class="longinput"/>
										<br><span id="sidside" class="desc">请提供正确学(工)号，一旦注册不能更改！</span>
									</td>
								</tr>
								<tr>
									<td><span>姓名：</span></td>
									<td>
										<input type="text" id="name" class="longinput">
										<br><span class="desc">此字段将显示在统计名单上</span>
									</td>
								</tr>
								<tr>
									<td><span>设置密码：</span></td>
									<td>
										<input type="password" id="newPwd" class="longinput" value="">
										<br><span class="desc" id="newPwdSide">请键入密码</span>
									</td>
								</tr>
								<tr>
									<td><span>确认密码：</span></td>
									<td>
										<input type="password" id="confirmNewPwd" class="longinput" value="">
										<br><span class="desc" id="confirmSide">确认密码须于密码相同</span>
									</td>
								</tr>

								<tr>
									<td><span>电子邮箱：</span></td>
									<td>
										<input type="text" id="email" class="longinput">
										<br><span class="desc">提供联系方式</span>
									</td>
								</tr>
								
								<!-- <tr>
									<td><span>备注：</span></td>
									<td>
										<input type="text" id="memo" class="longinput">
										<br><span class="desc">备注</span>
									</td>
								</tr> -->
							</table>
							<br id="br"/>
							<div id="uu" >
								<button type="button" id="save" class="stdbtn btn_blue"><span style="font-size: larger;" >(+)</span><span id="subtext">提交注册</span></button>
							</div>
							
							
						</form>

					</div>
					<!--errorcontent-->
				</div>
				<!--errorwrapper-->
			</div>

		</div>


		</div>
		<!--bodywrapper-->

	</body>
</html>
